import * as React from 'react'
import TaskDetailBody from './task/TaskDetailBody';
import AssignmentBody from './assignments/Index';
import ProgramBody from './program/ProgramBody';
import Result from 'antd/es/result';
declare var vscode: any;
const initRouteData = { type: '', params: {} }
export default class App extends React.Component<any>{
    state = {
        routeData: initRouteData
    }

    componentDidMount = () => {
        window.addEventListener('message', event => {
            const { routeData } = this.state
            let { data } = event
            data = data === "" ? initRouteData : data

            if (data.type === 'PROGRAM_DETAIL') {
                this.setState({ routeData: { ...data } })
            }
            if (data.type === 'TASK_DETAIL') {
                this.setState({ routeData: { ...data } })
            }

            if (data.type === 'ASSIGNMENT_DETAIL') {
                this.setState({
                    routeData: {
                        type: data.type,
                        params: { ...routeData.params, ...data.params }
                    }
                })
            }
            if (data.type === 'LOGIN_INFO') {
                vscode.setState(data.params)
            }
            if (data.type === 'LOGOUT') {
                this.setState({ routeData: { ...initRouteData } })
            }
        })
    }

    updateRouteData = (nextRouteData: any) => {
        const { routeData } = this.state
        this.setState({ routeData: { ...routeData, ...nextRouteData } })
    }

    renderComponent = () => {
        const { routeData } = this.state
        switch (routeData.type) {
            case 'PROGRAM_DETAIL': {
                return <ProgramBody {...routeData.params} />
            }
            case 'TASK_DETAIL': {
                return <TaskDetailBody {...routeData.params}
                    updateRouteData={this.updateRouteData} />
            }
            case 'ASSIGNMENT_DETAIL': {
                return <AssignmentBody {...routeData.params}
                    updateRouteData={this.updateRouteData} />
            }
        }
        return <Result
        status="403"
        title=""
        subTitle="点击左侧菜单「Click to sign in」按钮开始答题吧"
      />
    }

    render() {
        return <div>
            {this.renderComponent()}
        </div>
    }
}